<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Lesson管理系统</title>
    <link rel="stylesheet" href="../../style/board.css">
    <link rel="stylesheet" href="../../style/global.css">
    <link rel="stylesheet" href="../../bootstrap-4.6.2-dist/bootstrap-icons-1.10.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="../../bootstrap-4.6.2-dist/bootstrap-icons-1.10.5/font/bootstrap-icons.min.css">
</head>
<body class="bg-dark text-center">

<!--概览: 样式[卡片 外边距]-->
<section class="card m-1">
    <!--卡片头: 样式[卡片头]-->
    <article class="card-header">概览</article>
    <!--卡片体: 样式[卡片体 前景色]-->
    <article class="card-body text-muted">
        <article class="row">
            <div class="col-sm-3">
                今日新增用户<br/><br/><strong id="userTodayCount" class="overview">0</strong>
            </div>
            <div class="col-sm-3">
                用户总数<br/><br/><strong id="userTotalCount" class="overview">0</strong>
            </div>
            <div class="col-sm-3">
                今日新增订单<br/><br/><strong id="orderTodayCount" class="overview">0</strong>
            </div>
            <div class="col-sm-3">
                订单总数<br/><br/><strong id="orderTotalCount" class="overview">0</strong>
            </div>
        </article>
    </article>
</section>

<!--图例: 样式[流体容器 前景色]-->
<section class="container-fluid text-muted">
    <section class="row">

        <!--[用户性别 - 用户数量] 分析图-->
        <article class="col-sm-6 p-1">
            <div class="card">
                <div class="card-header">用户性别分析图</div>
                <div id="board01" class="board card-body"></div>
            </div>
        </article>

        <!--[视频评分 - 视频数量] 分析图-->
        <article class="col-sm-6 p-1">
            <div class="card">
                <div class="card-header">视频评分分析图</div>
                <div id="board02" class="board card-body p-0"></div>
            </div>
        </article>

        <!--[创建日期 - 用户数量] 分析图-->
        <article class="col-sm-6 p-1">
            <div class="card">
                <div class="card-header">日增用户分析图</div>
                <div id="board03" class="board card-body"></div>
            </div>
        </article>

        <!--[创建日期 - 订单数量] 分析图-->
        <article class="col-sm-6 p-1">
            <section class="card">
                <div class="card-header">日增订单分析图</div>
                <div id="board04" class="board card-body"></div>
            </section>
        </article>

    </section>
</section>

<!--JS-->
<!--核心JS-->
<script src="../../bootstrap-4.6.2-dist/bootstrap-icons-1.10.5/jquery-3.6.0.js"></script>
<script src="../../bootstrap-4.6.2-dist/bootstrap-icons-1.10.5/js/bootstrap.bundle.min.js"></script>
<script src="../../bootstrap-4.6.2-dist/bootstrap-icons-1.10.5/js/bootstrap.min.js"></script>
<script src="../../script/ajax.js"></script>
<script src="../../script/global.js"></script>
<script src="../../echarts/echarts.js"></script>
<script src="../../script/board.js"></script>
</body>
</html>